<template>
    <div class="orderRecord">
            
        <el-table
            :data="tableData"
            stripe
            style="width: 100%">
            <el-table-column
            prop="transactionType"
            :formatter="formateType"
            label="类别"
            >
            </el-table-column>
            <el-table-column
            prop="investProductName"
           :formatter="toUpperCase"
            label="货币对"
            >
            </el-table-column>
            <el-table-column
            prop="investAmount"
            label="金额数量">
            </el-table-column>
            <el-table-column
            prop="earnings"
            label="结算数量">
            </el-table-column>
             <el-table-column
            prop="tradeId"
            label="订单号">
            </el-table-column>
            <el-table-column
            prop="stockDate"
            label="成交时间"
            width="220"
            >
            </el-table-column>
        </el-table>
    </div>
</template>
<script>
import {mapState} from 'vuex'
import {getAllHistoryOrder} from '@/ajax/index'
export default {
    name:'OrderRecord',
    data(){
        return{
            tableData: []
        }
        
    },
    mounted(){
          this.getAllList()
    },
    methods:{
        toUpperCase:function(row, column) {
            return row.investProductName ? row.investProductName.toUpperCase() : '';
        },
        formateType:function(row, column){
            return row.transactionType == "option" ? '期权交易' : '杠杆交易'
        },
        formatDate(row,column) {
            let date = new Date(row.stockDate);
            let y = date.getFullYear();
            let MM = date.getMonth() + 1;
            MM = MM < 10 ? ('0' + MM) : MM;
            let d = date.getDate();
            d = d < 10 ? ('0' + d) : d;
            let h = date.getHours();
            h = h < 10 ? ('0' + h) : h;
            let m = date.getMinutes();
            m = m < 10 ? ('0' + m) : m;
            let s = date.getSeconds();
            s = s < 10 ? ('0' + s) : s;         
            return row.stockDate =  y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
        },
        async getAllList(){
            const param = {
                'customerId':'598240017348820992' || this.$store.state.userId,
                'accountType':'TRUTH',
                'productName':'',
                'pageNum':1,
                'pageSize':10
            }
            let result = await getAllHistoryOrder(param)

            if(result.code === '200' && result.data.state === '1'){ 
                this.tableData = result.data.data
                debugger
            }else{
                this.$alert(result.data.message,'富易');
            }
            
        }
    }

    
}
</script>
<style>
.orderRecord .el-table th,.el-table tr {cursor: pointer; background-color:#1b1c38;border-bottom: 1px solid #2e2f4d!important;}
.orderRecord .el-table__header-wrapper{background-color:#1b1c38;}
.orderRecord .el-table td, .el-table th.is-leaf{border-bottom: 1px solid #2e2f4d!important;}
.orderRecord .el-table th>.cell {font-size: 12px;font-weight: lighter;color: #72729C}
.orderRecord .el-table::before{height: 0px;}
.orderRecord .el-table--striped .el-table__body tr.el-table__row--striped td{background-color:#1b1c38;}
.orderRecord .el-table--enable-row-hover .el-table__body tr:hover>td {background-color: #1b1c38;}
.orderRecord .el-table__empty-block{background-color: #1b1c38;padding-top: 40px;}
.orderRecord .el-table .cell{color: #fff;}
</style>

<style lang="less" scoped>
.orderRecord{
     margin-top: 80px;
}
</style>
